
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:item_detail_demo/item_detail/model/item_detail_do.dart';
import 'package:provider/provider.dart';

import '../manager/item_detail_data_manager.dart';
import '../model/image_bean.dart';

class ItemImages extends StatefulWidget {
  const ItemImages({Key? key}) : super(key: key);

  @override
  State<ItemImages> createState() => _ItemImagesState();
}

class _ItemImagesState extends State<ItemImages> {

  @override
  Widget build(BuildContext context) {
    return Column(
      children: _buildImage8(Provider.of<ItemDetailDataManager>(context).itemDetailDO.pics),
    );
  }

  List<Widget> _buildImage8(List<ImageBean> pics) {
    final List<Widget> widgetList = <Widget>[];
    const int headLimited = 1;
    for (int i = 0; i < headLimited; i++) {
      widgetList.add(_buildBigPicWidget(i, pics));
    }

    const int middleCount = 4;
    const int middleLimited = middleCount + headLimited;
    for (int i = headLimited; i < middleLimited; i += 2) {
      widgetList.add(_buildRowPicWidget(pics, i, i + 1));
    }

    widgetList.add(_build3PicSmallWidget(middleLimited, pics));

    widgetList.add(Container(
      height: 8,
      color: const Color(0xFFF7F7F7),
      margin: const EdgeInsets.only(top: 18),)
    );
    return widgetList;
  }

  Widget _buildBigPicWidget(int index, List<ImageBean> pics) {
    final ImageBean imageBean = pics[index];
    final double imgWidth = MediaQuery.of(context).size.width - 32;
    return Container(
        // color: const Color(0xFFFAFAFA),
      margin: index > 0 ? const EdgeInsets.only(top: 1.0) : null,
      child: ClipRRect(
        borderRadius: const BorderRadius.all(Radius.circular(6.0)),
        child: Image.network(
          imageBean.imgUrl,
          width: imgWidth,
          height: imageBean.imgHeight * (imgWidth/imageBean.imgWidth),
        ),
      ),

    );
  }

  Widget _buildRowPicWidget(
      List<ImageBean> pics, int leftIndex, int rightIndex) {
    final ImageBean leftImageBean = pics[leftIndex];
    final ImageBean rightImageBean = pics[rightIndex];
    final double imgWidth = (MediaQuery.of(context).size.width - 32)/2 - 1;
    return Container(
      margin: const EdgeInsets.only(top: 2, left: 16, right: 16),
      child: Row(
        children: <Widget>[
          Container(
            margin: const EdgeInsets.only(right: 2),
            child: ClipRRect(
              borderRadius: const BorderRadius.all(Radius.circular(6.0)),
              child: Image.network(
                leftImageBean.imgUrl,
                width: imgWidth,
                height: leftImageBean.imgHeight * (imgWidth/leftImageBean.imgWidth),
              ),
            ),
          ),
          ClipRRect(
            borderRadius: const BorderRadius.all(Radius.circular(6.0)),
            child: Image.network(
              rightImageBean.imgUrl,
              width: imgWidth,
              height: rightImageBean.imgHeight * (imgWidth/rightImageBean.imgWidth),
            ),
          ),
        ],
      ),
    );
  }

  Widget _build3PicSmallWidget(int start, List<ImageBean> pics) {
    if (start + 3 > pics.length) {
      return Container();
    }
    final ImageBean leftImageBean = pics[start];
    final ImageBean middleImageBean = pics[start+1];
    final ImageBean rightImageBean = pics[start+2];
    final double imgWidth = (MediaQuery.of(context).size.width - 32)/3 - 2;
    return Container(
      color: Colors.white,
      margin: const EdgeInsets.only(top: 1, left: 16, right: 16),
      child: Row(
        children: <Widget>[
          Container(
            margin: const EdgeInsets.only(right: 2),
            child: ClipRRect(
              borderRadius: const BorderRadius.all(Radius.circular(6.0)),
              child: Image.network(
                leftImageBean.imgUrl,
                width: imgWidth,
                height: leftImageBean.imgHeight * (imgWidth/leftImageBean.imgWidth),
              ),
            ),
          ),
          Container(
            margin: const EdgeInsets.only(right: 2),
            child: ClipRRect(
              borderRadius: const BorderRadius.all(Radius.circular(6.0)),
              child: Image.network(
                middleImageBean.imgUrl,
                width: imgWidth,
                height: middleImageBean.imgHeight * (imgWidth/middleImageBean.imgWidth),
              ),
            ),
          ),
          ClipRRect(
            borderRadius: const BorderRadius.all(Radius.circular(6.0)),
            child: Image.network(
              rightImageBean.imgUrl,
              width: imgWidth,
              height: rightImageBean.imgHeight * (imgWidth/rightImageBean.imgWidth),
            ),
          ),
        ],
      ),
    );
  }
}
